{include file="public/head" /}
<div class="x-nav">
          <span class="layui-breadcrumb">
            <a href="">权限管理</a>
            <a href="">菜单管理</a>
            <a>
              <cite>菜单列表</cite></a>
          </span>
</div>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-body ">
                    <form class="layui-form layui-col-space5">
<!--                        <div class="layui-input-inline layui-show-xs-block">-->
<!--                            <input class="layui-input" placeholder="分类名" name="cate_name"></div>-->
<!--                        <div class="layui-input-inline layui-show-xs-block">-->
<!--                            <button class="layui-btn" lay-submit="" lay-filter="sreach"><i class="layui-icon"></i>增加</button>-->
<!--                        </div>-->
                    </form>
                </div>
                <div class="layui-card-header">
                    <button class="layui-btn {:adminAuthCheck('/Nav/add',$routeArr)}" onclick="xadmin.open('编辑','../Nav/add', 720, 650)">
                        <i class="layui-icon"></i>增加
                    </button>
                </div>
                <div class="layui-card-body ">
                <table class="layui-table layui-form">
                    <thead>
                    <tr>
                        <th width="70">ID</th>
                        <th>菜单名</th>
                        <th width="50">排序</th>
                        <th width="80" class="{:adminAuthCheck('/Nav/status',$routeArr)}">状态</th>
                        <th width="250">操作</th>
                    </tr></thead>
                    <tbody class="x-cate seach-box">
                    {volist name="data" id="v"}
                    <tr cate-id="{$v.id}" fid="{$v.nid}">
                        <td>{$v.id}</td>
                        <td>
                            <i class="layui-icon x-show" status="true"></i>
                            {$v.nav}
                        </td>
                        <td><input type="text" class="layui-input x-sort" name="order" value="{$v.sort}"></td>

                        <td class="{:adminAuthCheck('/Nav/status',$routeArr)}">
                            <input type="checkbox"  lay-filter="switchID" switch_id="{$v['id']}"
                            name="work_status" lay-text="开启|停用"  lay-skin="switch" {if condition="$v.status eq '1'"}checked="checked" {/if} >
                        </td>
                        <td class="td-manage">
                            <button class="layui-btn layui-btn layui-btn-xs {:adminAuthCheck('/Nav/update',$routeArr)}"
                                    onclick="xadmin.open('编辑','../Nav/update/id/{$v.id}', 720, 650)">
                                <i class="layui-icon"></i>编辑
                            </button>
                            <button class="layui-btn-danger layui-btn layui-btn-xs {:adminAuthCheck('/Nav/update',$routeArr)}"
                                    onclick="member_del(this,{$v.id})" href="javascript:;">
                                <i class="layui-icon"></i>删除
                            </button>
                        </td>
                    </tr>
                    {if condition="($v['wmenu'] neq '')"}
                        {volist name="v.wmenu" id="w"}
                            <tr cate-id="{$w.id}" fid="{$w.nid}" style="">
                                <td>{$w.id}</td>
                                <td>
                                    &nbsp;&nbsp;&nbsp;&nbsp;

                                    {if condition="(count($w['three']) > 0)"}
                                    <i class="layui-icon x-show" status="true"></i>
                                    {else}
                                    ├
                                    {/if}
                                    {$w.nav}
                                </td>
                                <td><input type="text" class="layui-input x-sort" name="order" value="{$w.sort}"></td>
                                <td class="{:adminAuthCheck('/Nav/status',$routeArr)}">
                                    <input type="checkbox" lay-filter="switchID" switch_id="{$w['id']}"
                                           name="work_status" lay-text="开启|停用"  lay-skin="switch" {if condition="$w.status eq '1'"}checked="checked" {/if} >
                                </td>
                                <td class="td-manage">
                                    <button class="layui-btn layui-btn layui-btn-xs {:adminAuthCheck('/Nav/update',$routeArr)}"
                                            onclick="xadmin.open('编辑','../Nav/update/id/{$w.id}', 720, 650)">
                                        <i class="layui-icon"></i>编辑
                                    </button>
                                    <button class="layui-btn-danger layui-btn layui-btn-xs {:adminAuthCheck('/Nav/delete',$routeArr)}"
                                            onclick="member_del(this,{$w.id})" href="javascript:;">
                                        <i class="layui-icon"></i>删除
                                    </button>
                                </td>
                            </tr>
                            {if condition="($w['three'] neq '')"}
                                {volist name="w.three" id="m"}

                                <tr cate-id="{$m.id}" fid="{$m.nid}" style="">
                                    <td>{$m.id}</td>
                                    <td>
                                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                        ├{$m.nav}
                                    </td>
                                    <td><input type="text" class="layui-input x-sort" name="order" value="{$m.sort}"></td>
                                    <td class="{:adminAuthCheck('/Nav/status',$routeArr)}">
                                        <input type="checkbox" lay-filter="switchID" switch_id="{$m['id']}"
                                               name="work_status" lay-text="开启|停用"  lay-skin="switch" {if condition="$m.status eq '1'"}checked="checked" {/if} >
                                    </td>
                                    <td class="td-manage">
                                        <button class="layui-btn layui-btn layui-btn-xs {:adminAuthCheck('/Nav/update',$routeArr)}"
                                                onclick="xadmin.open('编辑','../Nav/update/id/{$m.id}', 720, 650)">
                                            <i class="layui-icon"></i>编辑
                                        </button>
                                        <button class="layui-btn-danger layui-btn layui-btn-xs {:adminAuthCheck('/Nav/delete',$routeArr)}"
                                                onclick="member_del(this,{$m.id})" href="javascript:;">
                                            <i class="layui-icon"></i>删除
                                        </button>
                                    </td>
                                </tr>
                                {/volist}
                            {/if}
                        {/volist}
                    {/if}
                    {/volist}
                    </tbody>
                </table>
            </div>

            </div>
        </div>
    </div>
</div>

</body>
<script>
    layui.use(['laydate', 'form', 'laypage'], function(){
        var laydate = layui.laydate;
        var laypage = layui.laypage;
        var form = layui.form;
        var url = '{:url("../Nav/index")}'+'?{$query}';

        //执行一个laydate实例
        laydate.render({
            elem: '#start' //指定元素
        });

        //执行一个laydate实例
        laydate.render({
            elem: '#end' //指定元素
        });

        //执行一个laypage实例
        laypage.render({
            elem: 'page' //注意，这里的 test1 是 ID，不用加 # 号
            ,count:'{$count}'//数据总数，从服务端得到
            ,limit :'{$pageTotal}'
            ,curr:'{$curr}'
            ,jump: function(obj, first){
                if(!first){ //一定要加此判断，否则初始时会无限刷新
                    location.href = url+'&page='+obj.curr;
                }
            }
        });
        // 开启|关闭
        form.on('switch(switchID)',function(data){
            //开关是否开启，true或者false
            var checked =  data.elem.checked;
            //获取所需属性值
            var switch_id =  data.elem.attributes['switch_id'].nodeValue;
            var status = 0;
            if(checked == true){
                status = 1;
            }
            $.ajax({
                type: "POST",
                url: "{:getUrl()}Nav/status",
                data: {id:switch_id,status:status},
                dataType: "json",
                success: function(res){
                    if(res.code == 200){
                        // 修改成功
                        if(checked == true){
                            layer.msg('已开启!',{icon: 6,time:1000});
                        }else{
                            layer.msg('已停用!',{icon: 5,time:1000});
                        }
                    }else{
                        // 修改失败
                        layer.msg(res.msg,{icon: 5,time:1000});
                    }
                }
            });
        })
    });

    /*菜单-删除*/
    function member_del(obj,id){
        layer.confirm('确认要删除吗？',function(index){
            //发异步删除数据
            $.ajax({
                type: "POST",
                url: "{:getUrl()}Nav/delete",
                data: {id:id},
                dataType: "json",
                success: function(data){
                    if(data.code > 0)
                    {
                        $(obj).parents("tr").remove();
                        layer.msg('已删除!',{icon:1,time:1000},function(){
                            parent.location.reload();
                        });
                    }
                    else
                    {
                        layer.msg(data.msg,{icon: 5,time:1000},function(){
                            parent.location.reload();
                        });
                    }
                }
            });
        });
    }
    // 分类展开收起的分类的逻辑
    $(function(){
        $("tbody.x-cate tr[fid!='0']").hide();
        // 栏目多级显示效果
        $('.x-show').click(function () {
            if($(this).attr('status')=='true'){
                $(this).html('&#xe625;');
                $(this).attr('status','false');
                cateId = $(this).parents('tr').attr('cate-id');
                $("tbody tr[fid="+cateId+"]").show();
            }else{
                cateIds = [];
                $(this).html('&#xe623;');
                $(this).attr('status','true');
                cateId = $(this).parents('tr').attr('cate-id');
                getCateId(cateId);
                for (var i in cateIds) {
                    $("tbody tr[cate-id="+cateIds[i]+"]").hide().find('.x-show').html('&#xe623;').attr('status','true');
                }
            }
        })
    })
    var cateIds = [];
    function getCateId(cateId) {
        $("tbody tr[fid="+cateId+"]").each(function(index, el) {
            id = $(el).attr('cate-id');
            cateIds.push(id);
            getCateId(id);
        });
    }
</script>
</html>